<template>
    <div>
        <h3>排房列表</h3>
        房型
        <select v-model="info.housetypeid">
            <option value="">请选择</option>
            <option v-for="item in data1.list" :value="item.houseTypeId">{{ item.houseTypeName }}
            </option>
        </select>
        房号
        <select v-model="info.housenoid">
            <option value="">请选择</option>
            <option v-for="item in data2.list" :value="item.houseNoId">{{ item.houseNoName }}</option>
        </select>
        <input type="button" value="查询" class="btn btn-success" @click="HouseRowShow">
        <input type="button" value="批量删除" class="btn btn-success" @click="DelAll">
        <input type="button" value="批量调整房态" class="btn btn-success" @click="Updatestate">
        <table class="table table-bordered">
            <tbody>
                <tr>
                    <td><input type="checkbox" v-model="checked" @change="checkall"></td>
                    <td>入住人手机号</td>
                    <td>身份证号</td>
                    <td>姓名</td>
                    <td>入住日期</td>
                    <td>离店日期</td>
                    <td>房型名称</td>
                    <td>房号</td>
                    <td>操作</td>
                </tr>
                <tr v-for="item in data" :key="item.houseRowId">
                    <td><input type="checkbox" v-model="ids" :value="item.houseRowId" @change="idsall"></td>
                    <td>{{ item.tel }}</td>
                    <td>{{ item.card }}</td>
                    <td>{{ item.userName }}</td>
                    <td>{{ item.inTime }}</td>
                    <td>{{ item.outTime }}</td>
                    <td>{{ item.houseTypeName }}</td>
                    <td>{{ item.houseNoName }}</td>
                    <td>
                        <input type="button" value="删除" class="btn btn-danger" @click="Del(item.houseRowId)">
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">
import { ref, reactive, onMounted, registerRuntimeCompiler } from 'vue'
import axios from 'axios';
import { useRouter, useRoute } from 'vue-router';
const router = useRouter();
const route = useRoute();
onMounted(() => {
    Showhousetype();
    Showhouseno();
    HouseRowShow();
})
//全选全不选变量
let checked: any = ref(false);
let ids: any = ref([]);
const checkall = () => {
    console.log(checked.value);
    if (checked.value) {
        ids.value = data.value.map((item: any) => {
            return item.houseRowId
        })
    }
    else {
        ids.value = [];
    }
}
const idsall = () => {
    if (ids.value.length == data.value.length) {
        checked.value = true
    }
    else {
        checked.value = false
    }
}
const Updatestate = () => {
    
}
//批删
const DelAll = () => {
    axios({
        url: '/api/HouseType/DelHouseRowAll',
        method: 'put',
        params: {
            ids: ids.value.toString()
        }
    })
        .then((res) => {
            console.log(res);
            if (res.data > 0) {
                alert('删除成功')
                HouseRowShow();
            }
            else {
                alert('删除失败')
                return;
            }
        })
        .catch((err) => {
            console.log(err);

        })
}
//获取房型的参数
let type: any = reactive({
    pageindex: 1,
    pagesize: 20,
    housetypename: '',
    area1: '',
    area2: ''
})
//返回的房型数据
let data1: any = reactive({
    listcount: '',
    pagecount: '',
    list: []
})
const Showhousetype = () => {
    axios({
        url: '/api/HouseType/GetHouseTypeList',
        method: 'get',
        params: type
    })
        .then((res) => {
            console.log(res);
            Object.assign(data1, res.data)
        })
        .catch((err) => {
            console.log(err);

        })
}
//获取房号列表,后端
let data2: any = reactive({
    listcount: '',
    pagecount: '',
    list: '',
})
let type2: any = reactive({
    pageindex: 1,
    pagesize: 20,
    housenoname: '',
    houseTypeId: '',
})
const Showhouseno = () => {
    axios({
        url: '/api/HouseType/GetHouseNoList',
        method: 'get',
        params: type2
    })
        .then((res) => {
            console.log(res);
            Object.assign(data2, res.data)
        })
        .catch((err) => {
            console.log(err);

        })
}
//删除
const Del = (id: any) => {
    var f = confirm('确认删除吗?')
    if (f) {
        axios({
            url: '/api/HouseType/DelHouseRow',
            method: 'delete',
            params: {
                id: id
            }
        })
            .then((res) => {
                console.log(res);
                if (res.data > 0) {
                    alert('删除成功')
                    HouseRowShow();
                }
                else {
                    alert("删除失败")
                    return
                }
            })
            .catch((err) => {
                console.log(err);

            })
    }

}
//显示
let data: any = ref([])
let info = reactive({
    housetypeid: '',
    housenoid: ''
})
const HouseRowShow = () => {
    axios({
        url: '/api/HouseType/ShowDto',
        method: 'get',
        params: info
    })
        .then((res) => {
            console.log(res);
            data.value = res.data
        })
        .catch((err) => {
            console.log(err);

        })
}
</script>

<style scoped></style>